<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>执行上下文栈练习</title>
</head>

<body>
    <!-- 
        1. 依次输出的结果
            global begin: undefined
            function is called before1
            function is called before2
            function is called before3
            function was called3
            function was called2
            function was called1
            global end:1
        2. 一共几个执行上下文
            5个
     -->
    <script>
        console.log('global begin: ' + i)
        var i = 1
        Fn(1)
        function Fn(i) {
            if (i === 4) {
                return
            }
            console.log('function is called before' + i)
            Fn(i + 1)
            console.log('function was called' + i)
        }
        console.log('global end:' + i)
    </script>



    <!-- 
    1.练习1
        变量提升和函数提升的先后顺序
            先执行变量提升，再执行函数提升  
    -->
    <script>
        function a() { }
        var a
        // 输出function；先执行变量提升，再执行函数提升
        console.log(typeof a)
    </script>
    <!-- 
        2.练习2
     -->
    <script>
        if (!(b in window)) {
            var b = 1
        }
        // undefined
        console.log(b)
    </script>
    <!-- 
        3.练习3
     -->
    <script>
        // 存在变量提升和函数提升
        var c = 1
        function c(c) {
            console.log(c)
        }
        // 报错，c is not a function
        c(2)
        // 实际的执行过程为
        // var c
        // function c(c) {
        //     console.log(c)
        // }
        // c = 1
        // c(2)
    </script>
</body>

</html>